import { onMounted, reactive } from "vue";
import axios from "axios";

// 将数据和方法放在一个函数中,然后将函数暴露
export default function () {
  // 数据
  let dogList = reactive<string[]>([]);

  // 方法
  // 使用async和await代替then，(try catch)/拦截器代替catch
  async function getDog() {
    try {
      // result 接收请求成功返回的数据
      let result = await axios.get(
        "https://dog.ceo/api/breed/pembroke/images/random"
      );
      dogList.push(result.data.message); // 成功处理
    } catch (error) {
      // 请求失败 error:错误信息
      alert(error); // 失败处理
    }
  }
  // 钩子
  onMounted(() => {
    getDog();
  });
  // 向外界提供东西
  return { dogList, getDog };
}
